import defaultSettings from '@/assets/config/settings'
import variables from '@/assets/styles/global.module.scss'
const {sideTheme, topNav, tagsView, dynamicTitle} = defaultSettings

const storageSetting = JSON.parse(localCache.getItem('layout-setting')) || ''
const useSettingsStore = defineStore(
  'settings',
  {
    state: () => ({
      title: '',
      theme: storageSetting.theme || variables.primaryColor || '#1677ff',
      sideTheme: storageSetting.sideTheme || sideTheme,
      showSettings: false,
      topNav: storageSetting.topNav === undefined ? topNav : storageSetting.topNav,
      tagsView: storageSetting.tagsView === undefined ? tagsView : storageSetting.tagsView,
      dynamicTitle: storageSetting.dynamicTitle === undefined ? dynamicTitle : storageSetting.dynamicTitle
    }),
    actions: {
      // 修改布局设置
      changeSetting(data) {
        const {key, value} = data
        if (key in this) {
          this[key] = value
        }
      },
      // 设置网页标题
      setTitle(title: string) {
        this.title = title || ""
        useDynamicTitle();
      },
      saveSetting() {
        let layoutSetting = {
          theme: this.theme,
          sideTheme: this.sideTheme,
          topNav: this.topNav,
          tagsView: this.tagsView,
          dynamicTitle: this.dynamicTitle
        }
        let layoutSettingJson = JSON.stringify(layoutSetting);
        localCache.setItem('layout-setting', layoutSettingJson);
      },
      resetSetting() {
        localCache.removeItem("layout-setting");
      }
    }
  }
)

export {useSettingsStore}